@model Netnr.Func.ViewModel.DocTreeViewVM

@{
    var vm = new Netnr.Func.ViewModel.DocTreeViewVM()
    {
        DocTree = Model.DocTree,
        DsdId = Guid.Empty.ToString()
    };
}

<style>
    .cpbox a {
        padding: .3rem;
        font-size: 1.6rem;
        line-height: 1rem;
        text-align: center;
        display: inline-block;
        margin: .1rem .1rem 0;
        width: auto !important;
    }
</style>

<input type="hidden" id="DsdId" value="@Model.DsdId" />

<div class="netnrnav">
    <div class="netnrnav-wrapper">
        <ul>
            <li class="py-1 px-1 ">
                <input type="text" class="form-control txtSearch" name="name" placeholder="Search，Enter" autocomplete="off" />
                <div class="cpbox text-right">
                    <a href="/doc/code/edit/@Model.DsCode" title="Add">
                        <i class="fa fa-fw fa-plus"></i>
                    </a>
                    <a href="/doc/code/catalog/@Model.DsCode" title="Menu">
                        <i class="fa fa-fw fa-folder-open"></i>
                    </a>
                </div>
            </li>
            <partial name="_PartialDocTreeLoop" model="@vm" />
        </ul>
    </div>
</div>

<script>
    AutoExpand();
    function AutoExpand() {
        var dsdid = $('#DsdId').val();
        if (dsdid != "") {
            var ac = 'text-success', acbg = 'bg-light';
            $('.netnrnav').find('a.' + ac).removeClass(ac).removeClass(acbg);
            var cnode = $('.netnrnav').find('a[data-value="' + dsdid + '"]').first();
            cnode.addClass(ac + " " + acbg).parents('ul').css('display', 'block');
        }
    }

    //搜索
    function SearchNode() {
        $('.txtSearch').each(function () {
            if (!this.bind) {
                this.bind = true;

                $(this).on('input', function () {
                    var ulbox = $(this).parent().parent(), lisall = ulbox.children(), arra = [], search = this.value.trim().toLowerCase();
                    var lis = lisall.first().siblings();
                    lis.filter('[data-item="1"]').removeClass('d-none');
                    lis.filter('[data-item="0"]').remove();
                    if (search != "") {
                        lis.addClass('d-none').attr('data-item', 1);
                        lis.find('a[data-leaf="1"]').each(function () {
                            if ($(this).text().toLowerCase().indexOf(search) >= 0) {
                                var ali = '<li data-item="0">' + $(this).parent().html() + '</li>';
                                arra.indexOf(ali) == -1 && arra.push(ali);
                            }
                        });
                        ulbox.append($(arra.join('')));
                    }
                });
            }
        })
    }
    SearchNode()
    $('.MenuToggle').click(function () {
        setTimeout(function () {
            SearchNode()
        }, 100)
    });

</script>

<partial name="_PartialQuote" model="@("netnrnav.css,netnrnav.js")" />